import React, { useEffect, useState } from 'react';
import { getTableData } from '@test/api/test';
import { Table } from 'antd';

export const Itable: React.FC = () => {
  const [data, setData] = useState([]);

  const columns = [
    {
      title: 'id',
      dataIndex: 'id',
      key: 'id',
    },
    {
      title: 'username',
      dataIndex: 'username',
      key: 'username',
    },
  ];

  const getData = async () => {
    const res = await getTableData();
    setData(res?.data ?? []);
  };

  useEffect(() => {
    getData();
  }, []);

  return (
    <div>
      <Table columns={columns} dataSource={data} rowKey={'id'} />
    </div>
  );
};

export default Itable;
